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III - Desenho de Sistemas 
Interactivos 

III. 2 - Modelos Mentals e 
Conceptuais II 

Conceptual Models, J. Johnson and A. 
Henderson (Artigo de Interactions Jan'02) 

Interaction Design, Cap. 2, J. Preece 



Melhor e Plor ? 
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Resumo Aula Anterior 



• Modelo Conceptual 
-Metaforas e analogias 
-Conceitos que o sistema expoe 

• objectos, atributos, operagoes 
- Relagoes entre conceitos 
-Mapeamento entre conceitos e 
elementos fisicos 

• Metricas de Usabilidade 
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Metaforas 



• Pode-se usar mais que uma metafora 
num modelo conceptual 

• As metaforas fazem com que os 
utilizadores usem ... 

• Reconhecimento em vez de 

Lembranga 

• Porque? 
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Sumarlo 



• Modelo Conceptual (Cont.) 
-Cenarios de Actividades 

- Do Modelo Conceptual ao Projecto 

Completo (Beneficios) 
-Conclusoes do Modelo Conceptual 

• Modelo Mental 

• Tipos de Modelos Conceptuais 

• Exemplos 
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Cenarios 



Analise de Tarefas 



JH 



Tarefas Relevantes 




JH 



Modelo Conceptual 



JT 



Cenarios de Actividade 



-a 



Cenarios de Interacgao 






Storyboard 
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Cenarios do Problema (reiembrar) 



• Resultam da analise de tarefas 

• Descrevem tarefas no domfnio do 
problema 

• Constroem-se a partir das tarefas 
relevantes seleccionadas 

• Descrigao independente da solugao 
actual/futura 
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Cenarios de Actividades 



• Criados com o modelo conceptual 

• Transformam actividades correntes 
para usar as vossas ideias 

• Descrevem novas funcionalidades 
(Inclufdas no modelo conceptual) 

• Descrigao independente da solugao 
da lU 
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Desenho de Cenarios 



• Concentrar em tarefas centra is/crfticas 

- Descrever acgoes de actores Imaglnados 
-SImular tarefas, objectives, pianos e 

reacgoes 
-Incluir acgoes relevantes do actor 
-Sejam criatlvos nas narratlvas 

• Reutilizar actores e artefactos 

- Para aumentar coerencia atraves dos 

varlOS cenarios (Problema, Actividades, Interacgao) 
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Exempio MC + Cenario Actividades 



• Aplicagao para organizar fotografias 

• Metafora: Album de fotografias 

• Conceitos: Fotos, Data, Legenda, Utilizador, 
Evento, Arquivo, Arquivo partilhado, etc. 

• Rela^oes entre Conceitos: Fotos tern legendas; 
Arquivo tern fotos, etc. 

• Ac^oes: Inserir fotos; apagar fotos, Acrescentar 
legenda, etc. 

• Mapeamento: Inserir <-> Colocar; Apagar <-> 
Retirar; Legenda <-> Nota na margem; etc. 



IIL2 Modelos Mentals e Conceptuais II 



Cenario de Actividades 



• Cenario: O Joao acabou de vir da sua viagem a Pas de La 
Casa, onde esteve com os seus amigos. Chegado a casa, o 
Joao tirou a sua nova maquina digital do saco e foi a correr 
passar as fotografias para o BiblioPlioto, o seu programa 
para organizar e partiliiar fotografias. Depois de se 
autenticar no sistema, o Joao transferiu os 512i^Bs de 
fotografias, com todos os momentos de alegria, 
confraternizatjao e aprendizagem, e ainda a famosa queda 
do Antonio. Inseridas as fotos na aplicagao o Joao comega 
a organiza-las por arguivos e a classifica-las acrescentando 
legendas e observacoes em cada uma. Terminada a 
classificagao, o Joao selecciona um conjunto de fotos e 
disponibiliza-as num arquivo partilhado , para gue a Ana 
e o Antonio possam dar uma vista de oltios. 
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Do Modelo Conceptual ao Projecto Completo 



• Modelo conceptual como primeiro passo 
de desenho tern varios beneflCiOS: 

- Lexico de termos a usar na aplicagao e na 
documentasao 

• Ex. Ceiula vs Contentor 

- Cenarios de Actividades - Descrevem as 
actividades dos cenarios do problema usando 
as vossas ideias (novas) 

• Servem para verificar a validade do desenino 

• Usados na documentagao do produto 

• Servem de guiao nos testes de usabilidade 

• Servem de base aos Cenarios de Interacgao 
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Do Modelo Conceptual ao Projecto Completo 



• Beneffcios (cont.) 
-Interface Utilizador 

• modelo conceptual "diz" o que a lU deve 
"dar" ao utilizador 

• deseniio da lU converte os conceitos 
abstractos do MC em elementos da lU 

• Cenarios de Actividade podem ser reescritos 
para criar Cenarios de Interacgao 
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Do Modelo Conceptual ao Projecto Completo 



• Beneffcios (cont.) 
-Implementagao 

• Semelhanga entre analise de objectos/acgoes 
e analise orientado por objectos 

• Pode ser usado como 1° passo na Analise por 
objectos 

- Documentagao 

• Modelo Conceptual fornece material para a 
equipa de documentagao. 
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Do Modelo Conceptual ao Projecto Completo 




• Beneffcios (cont.) 
- Processo de Desenho 

• Ponto de coordenagao central da equipa de 
desenvolvimento 

• Novos conceitos podem ser adicionados ao 
modelo (consentimento) 

• Depois dos testes pode-se alterar o modelo 
conceptual 
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Conclusdes Modelo Conceptual 



Boas interfaces comegam com um modelo 
conceptual 

- Limpo, simples e orientado a tarefa 
Modelo conceptual e o esqueleto da concepgao 
do sistema interactive 
Todo desenho e impiementagao deve-se 
basear no Modelo Conceptual 
Sendo central, todos devem concordar com ele 

Nao Esquecer! - Conceber o que o sistema e 

e Nao como se apresenta 
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Modelo Mental 




"Whenever vumrthtn^ goes wrong, 

1 JiuipLuh this littli; burton Biul resian. 

1 wish my vrfiole liRr was like that!" 
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Modelo Mental 



• Modo como uma pessoa pensa que um 
sistema funciona 

• Podem ser criados atraves de 

- Utiiizagao do sistema 

- Observagao de outros utilizadores a usarem o 
sistema 

- Leitura de documentagao 

- Formagao 

• Criado pelos utilizadores 

• Utilizadores diferentes tem modelos 
mentals diferentes 
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Tipos de Modelos Mentals 



Modelos Estruturais: 

- Utilizador interiorizou como funciona o sistema 

• ex. Como funciona um carro 

- Tipicamente sao modelos simplificados para fazer 
predigoes 

- Pode ser usado para concertar um dispositivo 
avariado 

- A maioria das pessoas parece viver sem eles 

Modelos Funcionais: 

- utilizador interiorizou como usar o sistema 

• ex. Como guiar um carro 

- Desenvolvido a partir de conhecimento adquirido 
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Para que Servem 


Modelos Mentals 


• Explicar 






- que estou a ver 


agora? 




- que e que o sistema acabou de 


fazer? 


- que e que eu fiz 


para ele fazer 


aquilo? 


• Predizer 






- que posse fazer 


a seguir? 




- que acontece se 


fizer isto? 




- que fara o sistema? 




- que verei como 


resultado? 
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Relagao entre Modelos 




Designers 




Utilizadores 




Sistema 



• Utilizagao de Modelo Conceptual 
facilita criagao de Modelo Mental 
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Modelo Mental vs Conceptual 



• Ma correspondencia entre o Modelo 
Mental do utilizador e o Modelo 
Conceptual do Designer leva a 

- Diflculdade de aprender 

- Erros 

- Lentidao 

- Frustragao 
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Modelo Mental vs Conceptual 








f^~~- g 




^»'\? - ' ~^ 
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Tipos de Modelos Conceptuais 



• Baseados em Actividades 



• Baseados em Objectos 

Nao sao mutuamente exclusivos 
Podem-se combinar 



IIL2 Modelos Mentals e Conceptuais II 



III. 2 Modelos Mentals e Conceptuais II 



MCs Baseados em Actividades 



• Dar Instrugoes 

- Emitir comandos (com teclado ou teclas de 
fungao) e seleccionar opgoes via menus 

• Conversar 

- Interagir com o sistema em dialogos de 
pergunta-resposta 

• Manipular e Navegar (espago) 

- Actuar sobre objectos e interagir com 
representagoes virtuais 

• Explorar e Descobrir 

- Procurar informagao e descobrir coisas sem 
perguntar (informagao estruturada) 
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Par Instrugdes 



• Utilizadores instruem o sistema e dizem-Ihe 
que deve fazer 

- e.g. I^ostrar as horas, imprimir/guardar ficheiros 

• Modelo conceptual comum a muitos 
dispositivos e sistemas 

- e.g. CAD, processadores de texto, VCRs, 
maquinas de venda 

• Principal beneficio: Instrugoes suportam 
interacgao rapida e eficiente 

- Bom para acgoes repetitivas aplicadas a muitos 
objectos 
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Conversar 



• Modela dialogo entre pessoas 

• Desde menus baseados em 
reconhecimento de fala ate sistemas 
complexes de dialogo em Ifngua 
natural 

-Exemplos: horarios, motores de busca, 
ajudas, informagao turistica 

• Agentes virtuais na interface 

-e.g. Microsoft Bob e Clippy 
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Conversacionai - Pros e Contras 



• Pros: Permite aos utilizadores, especialmente 
novigos e tecnofobos, interagir c/ sistema de 
modo familiar 
- Confortaveis, a vontade, menos assustados 



• Contras: Mal-entendidos 
quando sistema nao 
entende o que utilizador 
diz 

• Mas o processamento de 
lingua natural tem vindo a 
melhorar... 




'If ynu'd like t« pr«H 1^ pKsa 3. 
If yvu'd like to press e, pt*6i 5..." 
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Exempio: AskJeeves.com 
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Manipular e Navegar 



• Manipular objectos e navegar atraves de 
espagos virtuais, como se faz no mundo real 

• Instancias deste tipo de modelo 

- Manipulagao directa 
-Ambientes de realidade virtual 

• Vantagem: Metodo de interacgao muito 
versatil 

• Desvantagem: Pessoas podem levar modelo 
a letra, esperando comportamentos como 
no mundo fisico. 
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Explorar e Descobrir 



• Deixar explorar e descobrir informagao 

- Fazemos isso c/ Revistas, livros, TV, radio, etc. 

• Quando vamos a urn consultorio ou livraria 
examinamos a informagao disponivel na 
procura de algo interessante para ler 

- CD-ROMs, paginas web, portals, etc., baseiam- 
se neste modelo 

• Ter cuidado a estruturar a informagao de 
modo a suportar uma navegagao eficaz. 
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Exercicio 



Qual o modelo ou modelos que melhor se 
adaptam a actlvldade de descarregar musica da 
webl 

(Dar Instrugoes, Conversar, Manipular e Navegar, Explorar e Descobrir) 

Resposta 

-A actlvldade envolve: Procurar, Seleccionar, 
Guardar, Catalogar e Descarregar fichelros. 

- Os utilizadores devem poder: Explorar e 
escutar amostras de muslcas e depols dar 
instru^oes para guardar e catalogar 

- Modelo conceptual baseado em 

Dar Instru^oes + Explorar e Descobrir 
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MCs Baseados em Objectos 



Geralmente usam analogia com mundo fisico 
Exemplos: livros, utensilios, veiculos 



Classico: 
Xerox Star 
baseado 
em objectos 
de escritorio 




SB 
□iE 
BEE] 

CBBS 



mmm 

aHBB 



appoint teirt. 
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Outro classico: foiha de calculo 

I 



Analogia c/ foIha 
de baiango 



• Interactiva e 
computacional 

• Facil de perceber 

• Aumentou MUITO 
desempenho dos 
contabilistas (e nao so) 

www, b ricklin.com /hi story /refcard 5. htm 



A VI5ICALC Screen 
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Qual e o melhor Modelo Conceptual? 



Dar instrugoes 

- Bom para tarefas repetitivas 

• por exempio, correcgao ortografica, gestae de fichelros 

Manlpulagao directa 

- Bom para «fazer» alguns tipos de tarefas 

• por exempio, projectar, desenhar, voar, conduzir, 
redimensionar janelas 

Conversar 

- Bom para criangas, pessoas que nao conseguem lidar 
com tecnologia, pessoas com limltagoes e aplicagoes 
especializadas 

• por exempio, servigos telefonicos 

Modelos hibrldos 

- Utilizados quando e posslvel executar a mesma tarefa, 
na mesma interface, de formas diferentes 

• levam mais tempo a aprender 
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Metafora? 
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Metafora? 
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Resumo 



• Modelo Conceptual (Cont.) 

- Cenarios de Actividades 

- Beneficios do Modelo Conceptual 

• Modelo Mental vs Conceptual 

• Tipos de Modelos Conceptuais 

• Exemplos 

• Modelo conceptual e o esqueleto da 
concepgao do sistema interactivo 

• Conceber o que o sistema e 

e Nao como se apresenta 
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Metafora? 
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Proxima Aula 



• Desenho de Ecras 
-Desenho Visual 
-Cor 

- Texto 

- Escrita de Texto 

• Ler: HCI, Cap. 5 (Pag. 211), Alan Dix 
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